<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta  name="author" content="ytt"/>
    <meta name="description" content="一个页面弹窗的任务提醒器" />
    <title>task</title>
    <link rel="stylesheet" href="task/task.min.css" />
    <style>
    	/*li:last-of-type*/
    </style>
</head>
<body>
	<button id="add1">任务通知1</button>
	<button id="add2">任务通知2</button>
	<button id="add3">不会消失的通知1</button>
	<div class="task-con" id="task-con">
		<div id="task-ct" class="task-ct">
			<i class="taskfont">&#xe651;</i>
		</div>
		<!--<div class="task-content" style="display: block;">
			<ul>
				<li class="task-list">
					<span class="task-name">测试信息一</span>
					<span class="task-num">20</span>
				</li>
				<li class="task-list">
					<span class="task-name">测试信息一</span>
					<span class="task-num">20</span>
				</li>
			</ul>
			<div class="arrow-bottom"></div>
		</div>-->
	</div>
	<script type="text/javascript" src="task/task.plugin.js"></script>
	<script type="text/javascript">
		var task = new Task({
			el:'task-con',	//容器
			autoDisappear:true,	//点击后时候消失
			dragAable:true,	//时候可拖拽
			tipAudio:true,//提示音
  			tipSrc:'./task/audio/tip.mp3',//提示音的src
		});
		
		
		var num1 = 10;
		var num2 = 5;
		document.getElementById('add1').onclick = function(){	//用点击模拟添加任务1
			task.addTask({
				title:'测试提醒1',
				num:num1,
				flag:'test1',
				type:1,
				cb:function(){//回调函数
					console.log('click test waring 1');
					cbTest('测试提醒1');
				}
			});
			num1 += 10;
		};
		document.getElementById('add2').onclick = function(){	//用点击模拟添加任务2
			task.addTask({
				title:'测试提醒2',
				num:num2,
				flag:'test2',
				type:1,
				cb:function(){
					console.log('click test waring 2');
					cbTest('测试提醒2');
				}
			});
			num2 += 10;
		};
		document.getElementById('add3').onclick = function(){ //不会消失的通知1
			task.addTask({
				title:'不会消失的通知1',
				num:'0',
				flag:'test3',
				type:2,
				cb:function(){
					cbTest('点击了不会消失的通知');
				}
			});
		};
		
		function cbTest(str){
			var tip = document.createElement('div');
			tip.className = 'tip-con';
			tip.innerHTML = '点击回调：'+str;
			document.body.appendChild(tip);
			setTimeout(function(){
				document.body.removeChild(tip);
				tip = null;
			},1500);
		};
	</script>
</body>
</html>